import React, { useState, useEffect } from 'react';
import { history } from 'umi';
import { findFullBack } from 'ser/actions';
import SelfHead from 'components/common/selfHead';
import Paging from 'components/common/paging';
import ListItem from './components/listItem';
import ADD from 'static/index/add_fk.png';

import './index.less';
// 稳产满产反馈
export default function FullBack() {
  const [list, setList] = useState([]);
  const [pageNumber, setPageNumber] = useState(1);
  const [pageSize, setPageSize] = useState(30);
  const [done, setDone] = useState(false);
  useEffect(() => {
    async function fetchData() {
      const res = await findFullBack({ pageNumber, pageSize });
      if (res.rows && res.rows.length > 0) {
        setDone(false);
        setList([...list, ...res.rows]);
      } else {
        setDone(true);
      }
    }
    fetchData();
  }, [pageNumber, pageSize]);
  function toDetail() {
    history.push('/fullBack/detail');
  }
  const Items =
    list.length > 0 &&
    list.map((item, index) => {
      return <ListItem key={item.feedbackId} item={item} />;
    });
  return (
    <div className="FullBack">
      <SelfHead title={'稳产满产反馈'} path="/" />
      <div className="content">
        <Paging
          render={() => Items}
          handlePageChange={() => setPageNumber(pageNumber + 1)}
          done={done}
        />
      </div>
      <div className="fixedBox">
        <div className="addBtn" onClick={() => toDetail()}>
          <img src={ADD} />
        </div>
      </div>
    </div>
  );
}
